<template>
  <div class="node_box">
    <el-table :data="form.outputData" style="width: 100%" border fit>
      <!-- <el-table-column type="selection" width="50" /> -->
      <el-table-column fixed type="index" label="序号" width="100" />
      <el-table-column prop="tableName" label="表名" width="100" />
      <el-table-column prop="name" label="名称" width="100" />
      <el-table-column prop="comment" label="备注" width="100">
        <!-- <template #default="{ row }">
          <el-input v-model="row.comment" />
        </template> -->
      </el-table-column>
      <el-table-column prop="indicatorName" label="指标名称" width="100">
        <template #default="{ row }">
          <el-input v-model="row.indicatorName" :disabled="row.typeEnum != 0" />
        </template>
      </el-table-column>
      <el-table-column prop="typeName" label="数据类型" width="100" />
      <el-table-column prop="size" label="长度" width="100" />
      <el-table-column prop="digit" label="小数点" width="100" />
      <el-table-column prop="typeEnum" label="字段类型" width="140">
        <template #default="{ row }">
          <el-select
            v-model="row.typeEnum"
            class="m-2"
            placeholder="请选择字段类型"
            size="large"
            style="width: 100px"
          >
            <el-option
              v-for="item in typeEnumList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </template>
      </el-table-column>
      <el-table-column prop="aggregationMethod" label="聚合函数" width="140">
        <template #default="{ row }">
          <el-select
            v-model="row.aggregationMethod"
            class="m-2"
            placeholder="请选择聚合方法"
            size="large"
            :disabled="row.typeEnum !== 0"
            style="width: 100px"
          >
            <el-option
              v-for="item in dataPeriodTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </template>
      </el-table-column>
    </el-table>
    <el-button class="mt-4" type="danger" @click="goToBack">取消</el-button>
    <el-button class="mt-4" type="primary" @click="goToCreateIndicator">完成</el-button>
  </div>
</template>
<script lang="ts">
export default { name: "IndicatorOutput" };
</script>
<script setup lang="ts">
import strategyManageAPI, {
  IndicatorInsertParameter,
  IndicatorCofig,
} from "@/api/strategy/strategyManage";
const props = defineProps<{
  indicatorOutputData: any;
  newTableName: string;
}>();
const router = useRouter();
const emit = defineEmits(["showCreateIndicator", "goToBack"]);
const indicatorInsertParameter = reactive<IndicatorInsertParameter>({});
const form = ref({
  dataSourceId: 0,
  dataSourceName: "",
  outputData: [],
});

// const selectedRows = ref([]);

const typeEnumList = [
  {
    value: 0,
    label: "指标列",
  },
  {
    value: 1,
    label: "维度列",
  },
  {
    value: 2,
    label: "数据期列",
  },
];

const dataPeriodTypeList = [
  {
    value: "SUM",
    label: "SUM()",
  },
  {
    value: "AVG",
    label: "AVG()",
  },
  {
    value: "MIN",
    label: "MIN()",
  },
  {
    value: "MAX",
    label: "MAX()",
  },
];

// 从localStorage获取用户信息
const getUserInfo = () => {
  const userInfoStr = localStorage.getItem("userInfo");
  if (userInfoStr) {
    try {
      return JSON.parse(userInfoStr);
    } catch (error) {
      console.error("解析用户信息失败:", error);
      return null;
    }
  }
  return null;
};

// 获取当前用户名
const getCurrentUsername = () => {
  const userInfo = getUserInfo();
  return userInfo?.username || "";
};

const goToCreateIndicator = () => {
  const indicatorConfigList = form.value.outputData.map((item: any) => {
    return {
      indicatorName: item.indicatorName,
      columnName: item.name,
      tableName: item.comment,
      alias: item.alias,
      datasourceId: form.value.dataSourceId,
      datasourceName: form.value.dataSourceName,
      dataType: item.typeName,
      size: item.size,
      digit: item.digit,
      typeEnum: item.typeEnum,
      aggregationMethod: item.aggregationMethod,
      creator: getCurrentUsername(),
    };
  }) as unknown as IndicatorCofig[];

  console.log(indicatorConfigList);

  // 验证 typeEnum 是否存在在typeEnumList中
  const hasInvalidTypeEnum = indicatorConfigList.some(
    (item) => !typeEnumList.find((type) => type.value === item.typeEnum)
  );
  if (hasInvalidTypeEnum) {
    ElMessage.error("指标类型不存在，请检查后再提交。");
    return;
  }

  // 保存当前勾选状态
  sessionStorage.setItem("outputData", JSON.stringify(form.value.outputData));
  const createIndicatorData = {
    dataSourceId: form.value.dataSourceId,
    dataSourceName: form.value.dataSourceName,
    newTableName: props.indicatorOutputData.newTableName,
    columns: indicatorConfigList,
  };
  console.log("触发");
  emit("showCreateIndicator", createIndicatorData);
};

const goToBack = () => {
  emit("goToBack");
};

onMounted(() => {
  if (props.indicatorOutputData) {
    form.value.dataSourceId = props.indicatorOutputData.dataSourceId;
    form.value.dataSourceName = props.indicatorOutputData.dataSourceName;
    form.value.outputData = props.indicatorOutputData.columns as [];
    form.value.outputData = form.value.outputData.filter(
      (item: any) => item.name !== "id"
    ) as unknown as [];
  }
});
</script>
